- page_title _('Get started with GitLab')
- content_for :page_specific_javascripts do
  = render "layouts/google_tag_manager_head"
= render "layouts/google_tag_manager_body"

.row.gl-flex-grow-1.gl-p-5{ data: { track_action: 'render', track_label: onboarding_track_label } }
  .gl-display-flex.gl-flex-direction-column.gl-align-items-center.gl-w-full
    .gl-display-flex.gl-flex-direction-column.gl-align-items-center.gl-pt-7.gl-mt-7.mw-460
      = image_tag 'learn-gitlab-avatar.jpg', width: '90'
      %h2.gl-text-center.gl-my-5= _('Get started with GitLab')
      %p.gl-text-center.gl-text-gray-700.gl-mb-7
        = _('Ready to get started with GitLab? Follow these steps to set up your workspace, plan and commit changes, and deploy your project.')
      = image_tag 'learn_gitlab/get_started.svg', width: '400', class: 'gl-max-w-full'
      %div
        = render Pajamas::ButtonComponent.new(variant: :confirm, href: project_learn_gitlab_path(@project),
          button_options: { class: 'gl-mt-7 js-get-started-btn',
                            data: { qa_selector: 'confirm_button', track_label: onboarding_track_label,
                            track_action: 'click_ok_lets_go' } }) do
          = s_("LearnGitlab|Ok, let's go")
